import React from 'react';
import { IFormItem, Itype } from '@/base-ui/form';
import { Popconfirm, Space, Dropdown, Menu, Button } from 'antd';
import { ISearchSelector, IToolButton } from '@/base-ui/tool-bar';

const menu = (
  <Menu
    items={[
      {
        key: 0,
        label: <span>详情</span>
      },
      {
        key: 1,
        label: <span>复制</span>
      },
      {
        key: 2,
        label: (
          <Button
            onClick={function () {
              window.print();
            }}
          >
            打印
          </Button>
        )
      }
    ]}
  />
);

/* 搜索区域 */
export const PageSearchConfig: IFormItem[] = [
  {
    type: 'input' as Itype,
    label: '批次编号',
    placeholder: '请输入批次编号'
  },
  {
    type: 'input' as Itype,
    label: '批次等级',
    placeholder: '请输入批次等级'
  },
  {
    type: 'input' as Itype,
    label: '转出单位',
    placeholder: '请输入转出单位'
  },
  {
    type: 'input' as Itype,
    label: '转移时间',
    placeholder: '请输入转移时间'
  },

  {
    type: 'select' as Itype,
    label: '数量',
    placeholder: '请选择数量区间',
    options: [
      { label: '1000以下', value: 'value1' },
      { label: '1000-5000', value: 'value2' },
      { label: '5000-20000', value: 'value3' },
      { label: '20000以上', value: 'value4' }
    ]
  },
  {
    type: 'select' as Itype,
    label: '辅料',
    placeholder: '请选择辅料数量',
    options: [
      { label: '1000以下', value: 'value1' },
      { label: '1000-5000', value: 'value2' },
      { label: '5000-20000', value: 'value3' },
      { label: '20000以上', value: 'value4' }
    ]
  },
  {
    type: 'input' as Itype,
    label: '负责人',
    placeholder: '请输入负责人'
  },
  {
    type: 'input' as Itype,
    label: '转移辅料',
    placeholder: '请输入转移辅料'
  },
  {
    type: 'input' as Itype,
    label: '备注',
    placeholder: '请输入备注'
  }
  // {
  //   type: 'password' as Itype,
  //   label: '密码',
  //   placeholder: '请输入密码'
  // },S
];

/* 工具栏区域 */

// 选择器配置
export const SearchSelector: ISearchSelector = {
  Options: [
    { label: '公司名称', value: '1' },
    { label: '批次编号', value: '2' },
    { label: '转移单位', value: '3' }
  ],
  defaultValue: '1',
  id: 8
};
// 按钮组
export const buttonGroup: IToolButton[] = [
  { type: 'delete', text: '批量删除', isShow: true, onClick: () => {} },
  { type: 'import', text: '导入', isShow: true, onClick: () => {}, id: 9 },
  { type: 'export', text: '导出', isShow: true, onClick: () => {}, id: 10 }
];

/* 表格区域 */

// 表格数据
export const FormDataSource: any = [
  {
    key: '0',
    batchNumber: '01',
    batchUnit: '一',
    outUnit: '某供应商',
    transferUnit: '某养殖单位',
    transferTime: '2022-03-12',

    transfercount: '40',
    transferauxiliarymaterial: '50',
    quantityoftransferauxiliarymaterials: '框',
    charge: '小李'
  },
  {
    key: '0',
    batchNumber: '01',
    batchUnit: '一',
    outUnit: '某供应商',
    transferUnit: '某养殖单位',
    transferTime: '2022-03-12',

    transfercount: '40',
    transferauxiliarymaterial: '50',
    quantityoftransferauxiliarymaterials: '框',
    charge: '小李'
  },
  {
    key: '0',
    batchNumber: '01',
    batchUnit: '二',
    outUnit: '某供应商',
    transferUnit: '某养殖单位',
    transferTime: '2022-03-12',

    transfercount: '40',
    transferauxiliarymaterial: '50',
    quantityoftransferauxiliarymaterials: '框',
    charge: '小李'
  },
  {
    key: '0',
    batchNumber: '01',
    batchUnit: '二',
    outUnit: '某供应商',
    transferUnit: '某养殖单位',
    transferTime: '2022-03-12',

    transfercount: '40',
    transferauxiliarymaterial: '50',
    quantityoftransferauxiliarymaterials: '框',
    charge: '小李'
  },
  {
    key: '0',
    batchNumber: '01',
    batchUnit: '三',
    outUnit: '某供应商',
    transferUnit: '某养殖单位',
    transferTime: '2022-03-12',
    transfercount: '40',
    transferauxiliarymaterial: '50',
    quantityoftransferauxiliarymaterials: '框',
    charge: '小李'
  },
  {
    key: '0',
    batchNumber: '01',
    batchUnit: '三',
    outUnit: '某供应商',
    transferUnit: '某养殖单位',
    transferTime: '2022-03-12',
    transferHandler: '某养殖单位',

    transfercount: '40',
    transferauxiliarymaterial: '50',
    quantityoftransferauxiliarymaterials: '框',
    charge: '小李'
  },
  {
    key: '0',
    batchNumber: '01',
    batchUnit: '一',
    outUnit: '某养殖户',
    transferUnit: '某养殖单位',
    transferTime: '2022-3-12',
    transfercount: '40',
    transferauxiliarymaterial: '50',
    quantityoftransferauxiliarymaterials: '框',
    charge: '小李'
  }
];
// 表格列配置
// type columnType = {
//   title: string
//   dataIndex: string
//   key: string
// }

// export const FormColumns: ColumnProps<columnType>[] = [
export const FormColumns: any = [
  {
    title: '批次编号',
    dataIndex: 'batchNumber',
    key: 'batchNumber',
    width: 120
  },
  {
    title: '批次等级',
    dataIndex: 'batchUnit',
    key: 'batchUnit',
    width: 120
  },
  {
    title: '转出单位',
    dataIndex: 'outUnit',
    key: 'outUnit',
    width: 100
  },
  {
    title: '转入单位',
    dataIndex: 'transferUnit',
    key: 'ransferUnit',
    width: 100
  },

  {
    title: '转移时间',
    dataIndex: 'transferTime',
    key: 'transferTime',
    width: 120
  },
  {
    title: '转移肉鸡数量',
    dataIndex: 'transfercount',
    key: 'transfercount',
    width: 100
  },
  {
    title: '转移辅料',
    dataIndex: 'transferauxiliarymaterial',
    key: 'transferauxiliarymaterial',
    width: 100
  },

  {
    title: '转移辅料数量',
    dataIndex: 'quantityoftransferauxiliarymaterials',
    key: 'cuantityoftransferauxiliarymaterials',
    width: 100
  },
  { title: '负责人', dataIndex: 'charge', key: 'charge', width: 100 },
  {
    title: '操作',
    dataIndex: 'action',
    key: 'action',
    width: 150,
    render: (_: any, record: { key: React.Key }) => (
      <Space>
        <a>详情</a>
        <a>编辑</a>
        <Popconfirm
          title="确定删除?"
          okText="确认"
          cancelText="取消"
          // cancelButtonProps={{ size: 'middle' }}
          onConfirm={() => {}}
        >
          <a style={{ color: '#ff4d4f' }}>删除</a>
        </Popconfirm>
        <Dropdown overlay={menu}>
          <a onClick={(e) => e.preventDefault()}>···</a>
        </Dropdown>
      </Space>
    ),
    fixed: 'right'
  }
];
//复选框的接口
export interface DataType {
  key: React.Key;
  id: string;
  name: string;
  age: number;
  address: string;
}
